﻿<%@ Page Title="" Language="C#" AutoEventWireup="true" CodeBehind="MonthHz.aspx.cs" Inherits="Thksoft.Module.ApplyView.Apply.Edit.MonthHz" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html class="L_UI">
<head id="Head1" runat="server">
    <meta charset="utf-8" />
    <title>资金集中管理平台</title>
    <link href="/CSS/Main.css" rel="stylesheet" />
    <link href="/App_Themes/MSN_Blue/default.css" rel="stylesheet" type="text/css" />
    <link href="/UserCotrols/My97DatePicker/skin/WdatePicker.css" rel="stylesheet" />
    <script src="/Scripts/jquery.1.11.1.js" type="text/javascript"></script>
    <script src="/UserCotrols/My97DatePicker/WdatePicker.js" type="text/javascript"></script>
    <script src="/UserCotrols/My97DatePicker/开发包/lang/zh-cn.js" type="text/javascript"></script>
    <script src="/Scripts/MyScript.js" type="text/javascript"></script>
    <script src="/Content/lib/layer/layer.js" type="text/javascript"></script>
    <script src="/Scripts/Tools.Module.js" type="text/javascript"></script>
    <script src="/Content/lib/vue/vue-2.5.17.min.js" type="text/javascript"></script>
    <style type="text/css">
        .Apply-Row-Lev-1 {
            background-color: #B2D8FF;
            font-size: 14px;
        }

        .Apply-Row-Lev-2 {
            background-color: #CCCCCC;
            font-size: 13px;
        }

        .Apply-Row-Lev-3 {
            background-color: white;
            font-size: 12px;
        }

        .Apply-Row-Lev-1 .INPUT {
            background-color: #B2D8FF;
            border-color: white;
        }

        .Apply-Row-Lev-2 .INPUT {
            background-color: #CCCCCC;
            border-color: white;
        }

        .Apply-Row-Lev-3 .INPUT {
            border-color: white;
        }
    </style>
</head>
<body>
    <div class="Window">
        <div id="app" class="Content" style="top: 0px;">
            <div class="Header lbltitle">
                月资金计划
            </div>
            <div class="Content">
                <div class="Content" style="overflow-x: auto; overflow-y: auto; top: 0px; bottom: 40px;">
                    <table class="table" width="100%" border="0" cellpadding="0" cellspacing="0">
                        <tr style="background-color:#29a1f7;opacity:0.7; font-size:16px;">
                            <th style="border: 1px solid #BAD4E1;text-align:center;color:white;">编号</th>
                            <th style="border: 1px solid #BAD4E1;text-align:center;color:white;">项目名称</th>
                            <th style="width: 110px;border: 1px solid #BAD4E1;text-align:center;color:white;">上月止累计资金计划</th>
                            <th style="width: 100px;border: 1px solid #BAD4E1;text-align:center;color:white;">上月止累计发生额</th>
                            <th style="width: 100px;border: 1px solid #BAD4E1;text-align:center;color:white;">申请金额</th>
                            <th style="border: 1px solid #BAD4E1;text-align:center;color:white;">备注</th>
                        </tr>
                        <template v-for="item in Models">
                    <tr :class="GetLev2(item)">
                        <td style="text-align:center;">{{item.N_PROJECT_ID}}</td>
                        <td>{{item.C_PROJECT_NAME}}</td>
                        <td>{{item.N_SYAMOUNT}}</td>
                        <td>{{item.N_USEAMOUNT}}</td>
                        <template v-if="item.N_TYPE == 2 || item.N_TYPE == 3">
                            <td style="padding-right:8px;">
                                        <div style="float: left; width:75%;">
                                            <input class="INPUT" style="text-align:left; width:100%;margin:0;padding:0;" :value="item.N_MONEY" @change="MoneyChange($event,item);" @dblclick="FORM_Details($event,item)" type="text" />
                                        </div>

                                        <div style="float: right;top:3px;position:relative;">
                                            <img v-bind:src="item.C_IMAGE_URL" />
                                        </div>
                            </td>
                            <td style="padding-right:8px;"><input class="INPUT" style="width:100%;margin:0;padding:0;" v-model="item.C_REMARK" type="text" /></td>
                        </template>
                        <template v-else>
                            <td style="padding-left:15px;text-align:left;">{{item.N_MONEY}}</td>
                            <td style="padding-right:8px;"><input class="INPUT" style="width:100%;margin:0;padding:0;border:0px;" v-model="item.C_REMARK" type="text" /></td>
                        </template>
                    </tr>
                </template>
                    </table>
                </div>
                <div class="Header" style="height: 40px; bottom: 0px; top: initial; text-align: center;">
                    <button type="button" class="bt_css_s" @click="Save">保存</button>
                    <button type="button" class="bt_css_s" @click="Load">初始化</button>
                </div>
            </div>
        </div>
        <script src="/Content/lib/jslinq/linq.js" type="text/javascript"></script>
        <script src="/Content/lib/vue/vue-2.5.17.min.js" type="text/javascript"></script>
        <script type="text/javascript">
            //构造Web程序入口
            var app = new Vue({
                el: "#app",
                data: {
                    Models: [],
                    ApplyId: <%=Request.Params.Get("ApplyId") %>
            },
                methods: {
                    FORM_Details: function (event,item) {
                        var that = this;
                        var applyId = item.N_MONTHAPP_ID;
                        var type = 2;
                        var proId = item.N_PROJECT_ID;
                        var code = item.C_DETAILS_CODE;
                        var arry = [
                            { Code: "T1", Url: "/Module/ProjectDetails/IncomeBusiness.aspx", Title: "主营业务收入月明细表" }, //IncomeOne.aspx
                            { Code: "T2", Url: "/Module/ProjectDetails/OutcomeGasMoney.aspx", Title: "天然气购入月明细表" },
                            { Code: "T3", Url: "/Module/ProjectDetails/OutcomeThree.aspx", Title: "安装外包费用月明细表" },
                            { Code: "T4", Url: "/Module/ProjectDetails/OutcomeFour.aspx", Title: "材料费用月明细表" },
                            { Code: "T5", Url: "/Module/ProjectDetails/OutcomeFive.aspx", Title: "大修费用月明细表" },
                            { Code: "T6", Url: "/Module/ProjectDetails/OutcomeInvestment1.aspx", Title: "城市管网项目月明细表" }
                        ]
                        for (var i = 0; i < arry.length; i++) {
                            if (arry[i].Code == code) {
                                var url = arry[i].Url;
                                url += "?ApplyId=" + applyId;
                                url += "&ProId=" + proId;
                                url += "&State=" + type;
                                url += "&type=0 "; //判断是0计划上报 1单位审批 2总部审批
                                //直接调用主页面的Layer  https://www.layui.com/doc/modules/layer.html
                                var option = {
                                    title: arry[i].Title,
                                    type: 2,
                                    content: [url, 'no'],
                                    area: ["850px", "530px"],
                                    scrollbar: false,
                                    success: function (laydom, index) {
                                        //添加刷新事件
                                        $(laydom)[0].ReLoad = function () {
                                            //$("#Button1").click();
                                            LoadDetails(applyId,event,item)
                                        };
                                    }
                                };
                                top.layer.open(option);
                                return;
                            }
                        }
                        function LoadDetails(applyId,event,item) {
                            //获取信息
                            $.ajax({
                                async: false,
                                type: "POST",
                                url: "/Module/ApplyView/ApplyHandler.ashx?MethodType=Get",
                                data: JSON.stringify({
                                    Type: "MonthHz",
                                    ApplyId: applyId
                                }),
                                success: function (result) {

                                    if (result.Type == 1) {
                                        //对数据做兼容处理
                                        //var data = [];
                                        for (var i = 0; i < result.Data.length; i++) {
                                            //var current = result.Data[i];
                                            if (item.N_PROJECT_ID == result.Data[i].N_PROID) {
                                                event.target.value = result.Data[i].N_AMOUNT
                                            }
                                            //data.push({
                                            //    N_MONTHAPP_ID: current.N_MONTHAPP_ID,
                                            //    C_DETAILS_CODE: current.C_DETAILS_CODE,
                                            //    N_PROJECT_ID: current.N_PROID,
                                            //    C_PROJECT_NAME: current.C_PRONAME,
                                            //    N_PARENT_PROJECT_ID: current.N_PARENTID,
                                            //    N_TYPE: current.N_TYPE,
                                            //    N_MONEY: current.N_AMOUNT == null ? 0 : current.N_AMOUNT,
                                            //    C_REMARK: current.C_REMARK == null ? "" : current.C_REMARK,
                                            //    N_USEAMOUNT: current.N_USEAMOUNT == null ? "0" : current.N_USEAMOUNT,
                                            //    N_SYAMOUNT: current.N_SYAMOUNT == null ? "0" : current.N_SYAMOUNT
                                            //});
                                        }
                                        //that.Models = that.BindData(data, "0");
                                        that.MoneyChange(event,item)
                                    }
                                },
                                error: function () {

                                    alert("网络断开或服务异常");
                                }
                            });
                        }

                    },
                    Close: function () {
                        if (top.layer == undefined) {
                            window.close();
                            return;
                        }
                        var index = top.layer.getFrameIndex(window.name); //获取窗口索引
                        try {
                            top.$("#layui-layer" + index + " .layui-layer-close").click();
                        } catch (e) {
                            console.log("已强制关闭页面!");
                            //强制关闭页面
                            try {
                                top.layer.close(index);
                            } catch (e) {
                                console.log("强制关闭页面异常!");
                            }
                        };
                    },
                    Save: function () {
                        var that = this;
                        var lodding = top.layer.load(1, {
                            shade: [0.8, '#393D49'],
                            content: '等待服务器端响应...',
                            success: function (layero) {
                                layero.find('.layui-layer-content').css({
                                    'padding-top': '39px',
                                    'width': '120px'
                                });
                            }
                        });
                        var data = [];
                        var count = 0;
                        for (var i = 0; i < that.Models.length; i++) {
                            data.push({
                                ProjectId: that.Models[i].N_PROJECT_ID,
                                Money: that.Models[i].N_MONEY == null ? 0 : that.Models[i].N_MONEY,
                                Remark: that.Models[i].C_REMARK == null ? "" : that.Models[i].C_REMARK
                            });
                            if (that.Models[i].N_MONEY == null || that.Models[i].N_MONEY == 0) {
                                count++;
                            }
                        }
                        if (count == that.Models.length) {
                            top.layer.close(lodding);
                            if (confirm("你没有填写资金计划,是否继续填写?")) {
                                return;
                            }
                        }
                        //获取信息
                        $.ajax({
                            type: "POST",
                            url: "/Module/ApplyView/ApplyHandler.ashx?MethodType=Save",
                            data: JSON.stringify({
                                Type: "Month",
                                ApplyId: that.ApplyId,
                                Data: data
                            }),
                            success: function (result) {
                                if (result.Type == 1) {
                                    if (confirm("提交成功，是否关闭当前页面")) {
                                        that.Close();
                                    }
                                }
                                top.layer.close(lodding);
                            },
                            error: function () {
                                alert("网络断开或服务异常");
                                top.layer.close(lodding);
                            }
                        });
                    },
                    GetLev: function (item) {
                        var lev = 1;
                        var that = this;
                        _GetLev(item);
                        switch (lev % 3) {
                            case 0:
                                return "Apply-Row-Lev-3";
                            case 1:
                                return "Apply-Row-Lev-1";
                            case 2:
                                return "Apply-Row-Lev-2";
                            default:
                                return "";
                        }

                        /**
                         * 递归获取等级
                         * @@param item 当前对象
                         * @@returns void
                         */
                        function _GetLev(item) {
                            if (item.N_PARENT_PROJECT_ID == 0 || item.N_PARENT_PROJECT_ID == null) {
                                return;
                            }
                            item = _GetByPid(item);
                            if (item == null) {
                                return;
                            }
                            lev += 1;
                            _GetLev(item);
                        }
                        /**
                         * 通过父级Id获取父级对象
                         * @@param item 当前对象
                         * @@returns Object 父级对象
                         */
                        function _GetByPid(item) {
                            for (var i = 0; i < that.Models.length; i++) {
                                if (that.Models[i].N_PROJECT_ID == item.N_PARENT_PROJECT_ID) {
                                    return that.Models[i];
                                }
                            }
                            return null;
                        }
                    },
                    GetLev2: function (item) {
                        if (item.N_PARENT_PROJECT_ID == null || item.N_PARENT_PROJECT_ID == 0) {
                            return "Apply-Row-Lev-1";
                        }
                        if (item.N_TYPE == 1) {
                            return "Apply-Row-Lev-2";
                        }
                        return "Apply-Row-Lev-3";
                    },
                    MoneyChange: function (event, item) {
                        var that = this;
                        if (event == null) {
                            var money = UpdateMoney(null);
                            return money;
                        }

                        if (item.N_TYPE == 2 || item.N_TYPE == 3) {
                            var value = null;
                            try {
                                if (event.target.value == "") {
                                    //return;
                                    event.target.value = 0;
                                }
                                value = eval(event.target.value);
                                console.log(value);
                                //value = parseFloat(event.target.value);
                            } catch (e) {
                                value = null;
                            }
                            if (value == null || value == undefined || isNaN(value) || parseFloat(value)>= 2147483647) {
                                if (confirm("请输入正确的金额,是否恢复原有数值？")) {

                                    event.target.value = item.N_MONEY.toString();
                                }
                                return;
                            }
                            //console.log(item);
                            item.N_MONEY = parseFloat(value.toFixed(4));
                            //console.log(value);
                            var money = 0;
                            const model = that.Models.find(({ N_PARENT_PROJECT_ID }) => N_PARENT_PROJECT_ID == 0)
                            if (model) {
                                money = UpdateMoney(0);
                            }
                            else {
                                money = UpdateMoney(null);
                            }
                            console.log("总额：" + money);

                        }
                        //重新计算Type

                        /**
                             * 递归更新父级对象
                             * @@param pid 父级Id
                             * @@returns 金额总额
                             */
                        function UpdateMoney(pid) {
                            var arry = GetByPid(pid);
                            for (var i = 0; i < arry.length; i++) {
                                //console.log(arry);
                                if (arry[i].N_TYPE != 2 && arry[i].N_TYPE != 3) {
                                    arry[i].N_MONEY = UpdateMoney(arry[i].N_PROJECT_ID);
                                }
                            }
                            var money = 0;
                            for (var i = 0; i < arry.length; i++) {
                                if (arry[i].N_MONEY == null || arry[i].N_TYPE == 3) {
                                    continue;
                                }
                                var value = arry[i].N_MONEY;
                                //console.log(value);
                                money += value;
                            }
                            return parseFloat(money.toFixed(4));
                        }
                        /**
                         * 通过Pid 获取页面模型的对象
                         * @@param pid 父级Id
                         * @@ Arry 子级对象集合
                         */
                        function GetByPid(pid) {
                            var arry = [];
                            for (var i = 0; i < that.Models.length; i++) {
                                if (that.Models[i].N_PARENT_PROJECT_ID == pid) {
                                    arry.push(that.Models[i]);
                                }
                            }
                            return arry;
                        }
                    },
                    Load: function () {
                        var that = this;
                        //Ajax调用Load接口
                        $.ajax({
                            async: false,
                            type: "POST",
                            url: "/Module/ApplyView/ApplyHandler.ashx?MethodType=Get",
                            data: JSON.stringify({
                                Type: "MonthHzLoad",
                                ApplyId: that.ApplyId
                            }),
                            success: function (result) {
                                if (result.Type == 1) {
                                    for (var i = 0; i < result.Data.length; i++) {
                                        for (var k = 0; k < that.Models.length; k++) {
                                            if (that.Models[k].N_PROJECT_ID == result.Data[i].N_PROJECT_ID) {
                                                that.Models[k].N_MONEY = result.Data[i].N_MONEY;
                                                that.Models[k].C_REMARK = result.Data[i].C_REMARK;
                                                break;
                                            }
                                        }
                                    }
                                    //that.Models = that.BindData(result.Data, "null");
                                    that.MoneyChange(null, null);
                                }
                            },
                            error: function () {
                                alert("网络断开或服务异常");
                            }
                        });
                    },
                    BindData: function (data, pid) {
                        var that = this;
                        var arry = [];
                        var currentData = Enumerable.From(data).Where("a => a.N_PARENT_PROJECT_ID ==" + pid).ToArray();
                        for (var i = 0; i < currentData.length; i++) {
                            arry.push(currentData[i]);
                            var currentData1 = that.BindData(data, currentData[i].N_PROJECT_ID);
                            for (var k = 0; k < currentData1.length; k++) {
                                arry.push(currentData1[k]);
                            }
                        }
                        return arry;
                    }
                },
                mounted: function () {
                    var that = this;
                    //获取信息
                    $.ajax({
                        async: false,
                        type: "POST",
                        url: "/Module/ApplyView/ApplyHandler.ashx?MethodType=Get",
                        data: JSON.stringify({
                            Type: "MonthHz",
                            ApplyId: that.ApplyId
                        }),
                        success: function (result) {

                            if (result.Type == 1) {
                                //对数据做兼容处理
                                var data = [];
                                for (var i = 0; i < result.Data.length; i++) {
                                    var current = result.Data[i];
                                    var imageUrl = null;
                                    switch (current.C_DETAILS_CODE) {
                                        case "T1":
                                            imageUrl = "/App_Themes/MSN_Blue/ProImages/15/主营业收入.png";
                                            break;
                                        case "T2":
                                            imageUrl = "/App_Themes/MSN_Blue/ProImages/15/天然气购入.png";
                                            break;
                                        case "T3":
                                            imageUrl = "/App_Themes/MSN_Blue/ProImages/15/安装外包费用.png";
                                            break;
                                        case "T4":
                                            imageUrl = "/App_Themes/MSN_Blue/ProImages/15/材料费用.png";
                                            break;
                                        case "T5":
                                            imageUrl = "/App_Themes/MSN_Blue/ProImages/15/大修费用.png";
                                            break;
                                        case "T6":
                                            imageUrl = "/App_Themes/MSN_Blue/ProImages/15/城市管网项目.png";
                                            break;
                                        default:
                                            imageUrl = null;
                                            break;
                                    }
                                    data.push({
                                        N_MONTHAPP_ID: current.N_MONTHAPP_ID,
                                        C_DETAILS_CODE: current.C_DETAILS_CODE,
                                        N_PROJECT_ID: current.N_PROID,
                                        C_PROJECT_NAME: current.C_PRONAME,
                                        N_PARENT_PROJECT_ID: current.N_PARENTID,
                                        N_TYPE: current.N_TYPE,
                                        N_MONEY: current.N_AMOUNT == null ? 0 : current.N_AMOUNT,
                                        C_REMARK: current.C_REMARK == null ? "" : current.C_REMARK,
                                        N_USEAMOUNT: current.N_USEAMOUNT == null ? "0" : current.N_USEAMOUNT,
                                        N_SYAMOUNT: current.N_SYAMOUNT == null ? "0" : current.N_SYAMOUNT,
                                        C_IMAGE_URL: imageUrl
                                    });
                                }
                                that.Models = that.BindData(data, "0");
                            }
                        },
                        error: function () {

                            alert("网络断开或服务异常");
                        }
                    });
                }
            });
        </script>
    </div>
</body>
</html>